<template>
  <view class="home">
    <view class="user">
      <view class="user_head">
        <view class="user_i">
          <view class="userHeaderInfoWrap">
            <view class="avatar">
              <view class="avatar-icon">
                <open-data type="userAvatarUrl"></open-data>
              </view>
            </view>
            <view class="user_xm">
              <view class="user_name">
                <open-data type="userNickName"></open-data>
              </view>
              <view class="userJobNum">
                <view class="jobNum"> 我的随手拍数：{{ totalPai }} </view>
                <view class="jobNum"> 我的任务数：{{ totalFeed }} </view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="user_container">
      <view class="user_body">
        <block v-for="(item, index) in menuList" :key="index">
          <view class="user_rights_item" @click="handleRoute(item.event)" v-if="item.showMenuItem">
            <image :src="item.src" class="icon_mine" mode="aspectFill" alt="">
            </image>
            <view class="user_rights_font">{{ item.itemName }}</view>
            <image :src="icon06" class="icon_jiantou" mode="aspectFill" alt=""> </image>
            <u-badge type="error" v-if="index===0" :count="myPaiWaitFeed+myPaiWaitAudit" class="badgeNum"></u-badge>
            <u-badge type="error" v-if="index===1" :count="myFeedWaitFeed+myFeedWaitAudit" class="badgeNum"></u-badge>
            <u-badge type="error" v-if="index===2" :count="allNeedFeed+allNeedAudit" class="badgeNum"></u-badge>
          </view>
        </block>
      </view>
    </view>
  </view>
</template>

<script>
// import {checkToken} from "../../../common/api/common";
import { totalPaiAndFeed } from "../../../common/api/mine";
let that

export default {
  data() {
    return {
      totalPai: 0,
      totalFeed: 0,
      myPaiWaitFeed: 0,
      myPaiWaitAudit: 0,
      myPaiFinished: 0,
      myFeedWaitFeed: 0,
      myFeedWaitAudit: 0,
      myFeedFinished: 0,
      allNeedFeed: 0,
      allNeedAudit: 0,
      allFinished: 0,
      icon00: "/static/img/icons/icon_mine_00.png",
      icon01: "/static/img/icons/icon_mine_01.png",
      icon03: "/static/img/icons/icon_mine_03.png",
      icon04: "/static/img/icons/icon_mine_04.png",
      icon06: "/static/img/icons/icon_arrow.png",
      icon07: "/static/img/icons/icon_mine_06.png",
      icon08: "/static/img/icons/icon_mine_07.png",
      qrCodeWhite: "/images/qr-code-white.png",
      accountNum: "",
      name: "",
      isStaff: "",
      team: "",
      score: "",
      menuList: [
        {
          event: "mySuiShouPai",
          src: "/static/img/icons/icon_mine_10.svg",
          itemName: "我的随手拍",
          showMenuItem: true
        },
        {
          event: "myFeedBack",
          src: "/static/img/icons/icon_mine_02.png",
          itemName: "我的任务",
          showMenuItem: true
        },
        {
          event: "myAudit",
          src: "/static/img/icons/icon_mine_03.png",
          itemName: "线上审核",
          showMenuItem: false
        },
        {
          event: "messageSubscribe",
          src: "/static/img/icons/icon_mine_09.png",
          itemName: "接收消息推送",
          showMenuItem: true
        },
        {
          event: "logout",
          src: "/static/img/icons/icon_mine_05.png",
          itemName: "退出登陆",
          showMenuItem: true
        },
      ],
    };
  },
  onLoad() {
    that = this;

  },
  onShow() {
    const _userInfo = uni.getStorageSync('_userInfo')
    if (_userInfo.can_audit === 1) {
      that.menuList[2].showMenuItem = true
    }
    const Data = {
      admin_user_id: _userInfo.admin_user_id,
    };
    totalPaiAndFeed(Data).then((res) => {
      // console.log('11111111111', res)
      that.totalPai = res.totalPai;
      that.totalFeed = res.totalFeed;
      that.myPaiWaitFeed = res.myPaiWaitFeed;
      that.myPaiWaitAudit = res.myPaiWaitAudit;
      that.myPaiFinished = res.totalPai - res.myPaiWaitFeed - res.myPaiWaitAudit
      that.myFeedWaitFeed = res.myFeedWaitFeed;
      that.myFeedWaitAudit = res.myFeedWaitAudit;
      that.myFeedFinished = res.totalFeed - res.myFeedWaitFeed - res.myFeedWaitAudit
      that.allNeedFeed = res.allNeedFeed
      that.allNeedAudit = res.allNeedAudit
      that.allFinished = res.allFinished
    });
  },
  onTabItemTap() {
    if (!uni.getStorageSync("_accessToken")) {
        uni.showToast({
          title: "请先登录才能操作",
          icon: "none",
          duration: 1000,
        });
        setTimeout(() => {
          this.$Router.push({
            name: "login",
          });
        }, 1000);
      }
  },
  methods: {
    handleRoute(event) {
/*       if (!uni.getStorageSync("_accessToken")) {
        uni.showToast({
          title: "请先登录才能操作",
          icon: "none",
          duration: 1000,
        });
        setTimeout(() => {
          this.$Router.push({
            name: "login",
          });
        }, 1000);
      } else { */
        switch (event) {
          case "mySuiShouPai":
            this.mySuiShouPai();
            break;
          case "myFeedBack":
            this.myFeedBack();
            break;
          case "myAudit":
            this.myAudit();
            break;
          case "messageSubscribe":
            this.messageSubscribe();
            break;
          case "logout":
            this.logout();
            break;
        }
      // }
    },
    mySuiShouPai() {
      this.$Router.push({
        name: "suishoupai",
        data: {
          showWhich: "pai",
          title: "我的随手拍",
          myPaiWaitFeed: that.myPaiWaitFeed,
          myPaiWaitAudit: that.myPaiWaitAudit,
          myPaiFinished: that.myPaiFinished
        },
      });
    },
    myFeedBack() {
      this.$Router.push({
        name: "suishoupai",
        data: {
          showWhich: "feedback",
          title: "我的任务",
          myFeedWaitFeed: that.myFeedWaitFeed,
          myFeedWaitAudit: that.myFeedWaitAudit,
          myFeedFinished: that.myFeedFinished
        },
      });
    },
    myAudit() {
      this.$Router.push({
        name: "myAudit",
        data: {
          showWhich: "feedback",
          title: "我的任务",
          allNeedFeed: that.allNeedFeed,
          allNeedAudit: that.allNeedAudit,
          allFinished: that.allFinished
        },
      });
    },
    // 接收消息推送
    // tS_CdzDZ6L0NCAAoGibxNxOokfCWT5c4Mou3WwgdFDM 随手拍通知
    // kQcA15ZclrAQr1nAUTXPBelz--aHgc2yFEGppz7pA7g 任务反馈通知-new
    // 62vh00k6vimxaed4JW79hsF2tdRwOsoZDb66OspiClY 软件开发快到期通知
    // EY774RJt_FJxsYAWmhgAupp2ddx5s8WREx-XeAr75Vs 任务快到期通知
    messageSubscribe() {
      let tmplIds = [
        "tS_CdzDZ6L0NCAAoGibxNxOokfCWT5c4Mou3WwgdFDM",
        "kQcA15ZclrAQr1nAUTXPBelz--aHgc2yFEGppz7pA7g",
        "EY774RJt_FJxsYAWmhgAupp2ddx5s8WREx-XeAr75Vs",
      ];
      uni.getSetting({
        withSubscriptions: true,
        success(res) {
          // console.log("wx.getSetting---", res);
          // let itemSettings = res.subscriptionsSetting.mainSwitch;
          /* if (itemSettings) {
            uni.showToast({
              title: "请勿重复授权",
              icon: "success",
              mask: true,
            });
            return;
          } else { */
          uni.requestSubscribeMessage({
            // tmplIds: app.globalData.templateList,
            tmplIds,
            success: (res) => {
              // console.log("requestSubscribeMessage", res);
              if (res.errMsg === "requestSubscribeMessage:ok") {
                  let flag = false;
                  for (let key in res) {
                    if (key !== "errMsg") {
                      let status = res[key];
                      if (status === "accept") {
                        flag = true;
                      }
                    }
                  }

                  if (flag) {
                    uni.showToast({
                      title: "已订阅",
                      icon: "none",
                    });
                  }
                }
              tmplIds.forEach((item) => {
                if (res[item] === "reject") {
                  wx.showToast({
                    title: "此次操作会导致您接收不到通知",
                    icon: "none",
                    duration: 1000,
                  });
                }
              });
            },
            fail: (err) => {
              /* uni.showToast({
                  title: "消息订阅失败",
                  icon: "error",
                  duration: 1000,
                }); */
              uni.showModal({
                // uniapp框架
                title: "请务必授权订阅消息",
                content: "您没有授权消息通知，是否进行授权",
                success: (res) => {
                  if (res.confirm) {
                    wx.openSetting({
                      success: (res) => {
                        // console.log(res);
                      },
                    });
                  } else if (res.cancel) {
                    wx.showToast({
                      title: "此次操作会导致您接收不到通知",
                      icon: "none",
                      duration: 1000,
                    });
                  }
                },
                fail: () => {},
                complete: () => {},
              });
            },
          });
          // }
        },
        fail: (err) => {
          // console.log(err.errMsg);
        },
      });
    },
    logout() {
      this.$Router.push({
        name: "login",
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.home {
  width: 100vw;
  min-height: 100vh;
  box-sizing: border-box;
  padding-bottom: 100rpx;
  background-color: #f7f8fa;
}
.user {
  width: 100vw;
  height: 288rpx;
  background-color: #f7f8fa;
}
.user_head {
  width: 100vw;
  height: 348rpx;
  position: absolute;
  top: -100rpx;
  left: 0;
  background-color: #1d63d6;
}
.user_i {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.user_xm {
  width: calc(100% - 150rpx);
}
.avatar-icon {
  width: 96rpx;
  height: 96rpx;
  border-radius: 48rpx;
  margin-left: 55rpx;
  margin-top: 165rpx;
  overflow: hidden;
}
.user_name {
  font-size: 32rpx;
  font-weight: 700;
  text-align: left;
  color: #ffffff;
  margin-top: 170rpx;
  margin-left: 25rpx;
}
.user_info {
  width: 660rpx;
  height: 200rpx;
  background: linear-gradient(133deg, #1db8d6 1%, #1d63d6 99%);
  border-radius: 20rpx;
  box-shadow: 0rpx 3rpx 30rpx 0rpx rgba(0, 0, 0, 0.05);
  margin-top: 35rpx;
  margin-left: 45rpx;
  display: flex;
  flex-direction: row;
}
.user_team {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-items: center;
  margin-top: 52rpx;
}
.user_score {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-items: center;
  margin-top: 52rpx;
}
.user_string {
  width: 1rpx;
  height: 150rpx;
  opacity: 0.2;
  margin-top: 25rpx;
  background-color: #ffffff;
}
.user_score1,
.user_team1 {
  width: 48rpx;
  height: 24rpx;
  font-size: 24rpx;
  font-weight: 500;
  text-align: center;
  color: #ffffff;
}
.user_score2,
.user_team2 {
  font-size: 64rpx;
  font-weight: 500;
  text-align: center;
  color: #ffffff;
  margin-top: 10rpx;
}
.user_container {
  background-color: #f7f8fa;
}
.user_body {
  width: 660rpx;
  background: #ffffff;
  border: 1rpx solid #f1f1f1;
  border-radius: 20rpx;
  box-shadow: 0rpx 3rpx 30rpx 0rpx rgba(0, 0, 0, 0.05);
  margin-left: 45rpx;
  margin-top: 20rpx;
  position: relative;
}
.user_rights_item {
  width: 660rpx;
  height: 120rpx;
  display: flex;
  flex-direction: row;
  border-bottom: 1px solid #f1f1f1;
}
.icon_mine {
  width: 48rpx;
  height: 50rpx;
  margin-top: 36rpx;
  margin-left: 50rpx;
}
.user_rights_font {
  font-size: 32rpx;
  font-weight: DemiLight;
  text-align: left;
  color: #000000;
  margin-top: 43rpx;
  margin-left: 40rpx;
}
.icon_jiantou {
  width: 12rpx;
  height: 24rpx;
  position: absolute;
  margin-top: 51rpx;
  margin-left: 598rpx;
}

.badgeNum {
  width: 12rpx;
  height: 24rpx;
  position: absolute;
  right: 0;
  // margin-top: 51rpx;
  // margin-left: 598rpx;
}
.user_order {
  width: 660rpx;
  height: 202rpx;
  background: #ffffff;
  border: 1rpx solid #f1f1f1;
  border-radius: 20rpx;
  box-shadow: 0rpx 3rpx 30rpx 0rpx rgba(0, 0, 0, 0.05);
  margin-left: 45rpx;
  margin-top: -132rpx;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.user_order_item {
  display: flex;
  flex-direction: column;
}
.user_order_img {
  width: 100rpx;
  height: 100rpx;
  margin-top: 30rpx;
}
.user_order_name {
  width: 88rpx;
  height: 22rpx;
  font-size: 22rpx;
  text-align: center;
  color: #333333;
  margin-top: 20rpx;
  margin-left: 71rpx;
}
.userJobNum {
  display: flex;
  flex-direction: row;
  color: #ffffff;
  font-size: 24rpx;
  margin-top: 12rpx;
}
.jobNum {
  flex: 1;
  margin-left: 25rpx;
}

.userHeaderInfoWrap {
  display: flex;
  width: 100vw;
}

.showQrcodeWrap {
  height: 38rpx;
  display: flex;
  padding: 20rpx;
  padding-right: 50rpx;
  border-left: 1px solid #ffffff;
  margin-top: 175rpx;
}

.showQrcodeWrap .Qrcode {
  width: 40rpx;
  height: 40rpx;
  margin-right: 14rpx;
}

.payInfoText {
  font-size: 32rpx;
  color: #ffffff;
}
</style>
